<template>
	<view class="main">
		<view :style="'padding-top:'+(demo.height+demo.top+10)+'px'">
			<head1 class="nav_top"
				:style="'height:' +  demo.height + 'px;' + 'padding-top:' + demo.top + 'px;padding-bottom:10px'"
				:nav="title">
			</head1>
		</view>
		<view class="joinReleamain">
			<view class="joinReleamainList">
				<view class="positClass">
					<text style="color:  #49b3af;">*</text><text>企业名称</text>
				</view>
				<input type="text" value="" placeholder="请填写企业名称" v-model="joinForm.companyName" />
				<view class="zc_line"></view>
			</view>
			<view class="joinReleamainList ">
				<view>
					<view class="positClass">
						<text style="color: #49b3af;">*</text><text>职位名称</text>
					</view>
					<input type="text" value="" placeholder="请填写职位名称" v-model="joinForm.postType" />
				</view>
				<view class="zc_line"></view>
			</view>
			<view class="joinReleamainList ">
				<view class="dis_flex">
					<view style="display: flex;" :class="joinForm.education==''?'activeTrue':'activeFalse'">
						<text>学历</text>
					</view>
					<view class="dis_flex common_line common_mypicker">
						<mypick :array="education" v-on:getChild="getEducation"></mypick>
						<text>></text>
						<text style="display: none;">{{joinForm.education}}</text>
					</view>
				</view>
				<view class="zc_line"></view>
			</view>
			<view class="joinReleamainList">
				<view class="positClass">
					<text style="color:  #49b3af;">*</text><text>招聘人数</text>
				</view>
				<input type="number" value="" placeholder="请填写招聘人数" v-model="joinForm.number" />
				<view class="zc_line"></view>
			</view>
			<view class="joinReleamainList">
				<view class="positClass">
					<text style="color:  #49b3af;">*</text><text>工作经验</text>
				</view>
				<input type="number" value="" placeholder="请填写工作经验" v-model="joinForm.background" />
				<view class="zc_line"></view>
			</view>

			<view class="joinReleamainList ">
				<view class="dis_flex" @click="showPCA">
					<view style="display: flex;" :class="joinForm.city==''?'activeTrue':'activeFalse'">
						<text>所在市区</text>
					</view>
					<view class="dis_flex common_line">
						<view>{{joinForm.city}}</view><text>></text>
					</view>
				</view>
				<view class="zc_line"></view>
			</view>
			

			<view class="joinReleamainList ">
				<view class="dis_flex">
					<view style="display: flex;" :class="joinForm.type==''?'activeTrue':'activeFalse'">
						<text>工作性质</text>
					</view>
					<view class="dis_flex common_line common_mypicker">
						<mypick :array="gzxz" v-on:getChild="getGzxzValue"></mypick>
						<text>></text>
						<text style="display: none;">{{joinForm.type}}</text>
					</view>
				</view>
				<view class="zc_line"></view>
			</view>
			<view class="joinReleamainList " @click="showCerts">
				<view class="dis_flex">
					<view class="positClass">
						<text>证书</text>
					</view>
					<view class="dis_flex common_line selectCerts">
						<text v-if="joinForm.certs==''">请选择证书</text>
						<text v-if="joinForm.certs!=''">{{joinForm.certs}}</text>
						<!-- <text style="display: none;">{{joinForm.certs}}</text> -->
					</view>
				</view>
				<view class="zc_line"></view>
			</view>
			<view class="joinReleamainList ">
				<view class="dis_flex">
					<view style="display: flex;" :class="joinForm.salary==''?'activeTrue':'activeFalse'">
						<text>薪资范围</text>
					</view>
					<view class="dis_flex common_line common_mypicker">
						<mypick :array="salary" v-on:getChild="getSalaryValue"></mypick>
						<text>></text>
						<text style="display: none;">{{joinForm.salary}}</text>
					</view>
				</view>
				<view class="zc_line"></view>

			</view>
			<view class="joinReleamainList">
				<view class="positClass">
					<text style="color:  #49b3af;">*</text><text>职位描述</text>
				</view>
				<textarea type="text" v-model="joinForm.details" value="" placeholder="介绍工作内容、职位要求、加分项" /></textarea>
				<view class="zc_line"></view>
			</view>
			<view class="joinReleamainList">
				<view class="positClass">
					<text>福利待遇</text>
				</view>
				<textarea type="text" value="" v-model="joinForm.welfare" placeholder="请输入福利待遇" /></textarea>
				<view class="zc_line"></view>
			</view>
			<view class="joinReleamainList">
				<view class="positClass">
					<text style="color:  #49b3af;">*</text><text>任职要求</text>
				</view>
				<textarea type="text" value="" v-model="joinForm.requirement" placeholder="请填写任职要求" /></textarea>
				<view class="zc_line"></view>
			</view>
			<view class="joinReleamainBtn" @click="subForm(joinForm)">提交</view>
		</view>
		<!-- 地区选择 -->
		<view class="selectCert">
			<pca-picker ref="pcaPicker" @confirm="getPCA" @fromChild="getChild"></pca-picker>
		</view>
		<!-- 证书选择 -->
		<cert v-if="certsIsShow" @getCersList="getcersList" :morenCert='moren'></cert>
	</view>
</template>

<script>
	import head1 from '../../common/head/head'
	import mypick from '../../components/mypick.vue'
	import pcaPicker from "../../components/pcaPicker/pcaPicker.vue"
	import cert from '@/components/lingdang-AddressPicker/AddressPicker.vue'
	export default {
		provide() {
			return {
				updateMoren: this.updateMoren
			}
		},
		components: {
			head1,
			mypick,
			pcaPicker,
			cert
		},
		data() {
			return {
				certsIsShow: false,
				title: '发布招聘',
				demo: {
					top: '',
					height: ''
				},
				moren: [],
				joinForm: {
					companyName: "",
					city: "四川省-成都市-武侯区",
					location: "",
					type: 'jbpart', //jbfull 全职 jbpart 兼职
					details: "",
					welfare: "",
					requirement: "",
					postType: '',
					salary: '',
					number: '',
					education: '',
					background: '',
					money: '',
					certs: ''
				},
				salary: [], //薪资范围
				postType: '', //职务类型
				education: [], //学历
				// background: [], //工作经验
				gzxz: [{
					enumId: 0,
					enumValue: 'jbpart',
					meaning: '兼职'
				}, {
					enumId: 1,
					enumValue: 'jbfull',
					meaning: '全职'
				}],
				gzxzID: ''
			}
		},
		created() {
			const demo = uni.getMenuButtonBoundingClientRect()
			this.demo.top = demo.top
			this.demo.height = demo.height
			// 加载数据
			this.getSysDict()
		},
		methods: {
			// 选择的证书
			getcersList(val) {
				this.joinForm.certs = val
				this.moren = val.split('-')
			},
			// 更新证书默认
			updateMoren(data) {
				this.moren = data.split('-')
			},
			showCerts(e) {
				// this.$refs.pcaPicker.show();
				this.certsIsShow = !this.certsIsShow
			},
			// 薪资范围
			getSalaryValue(childValue) {
				this.joinForm.salary = childValue
			},
			// 工作性质
			getGzxzValue(childValue) {
				this.joinForm.type = childValue
			},
			// // 职务类型
			// getPostTypeValue(childValue) {
			// 	this.joinForm.postType = childValue
			// },
			// 学历
			getEducation(childValue) {
				this.joinForm.education = childValue
			},
			// 学历
			// getBackground(childValue) {
			// 	this.joinForm.background = childValue
			// },
			// 数据加载
			getSysDict() {
				this.$myResquest.getDict({
					"enumCode": 'salary,job,background,education'
				}).then(res => {
					let data = res.data.data
					if (res.data.code == 200) {
						this.salary = data.salary
						this.postType = data.job
						this.education = data.education
						// this.background = data.background
						// 设置默认
						this.joinForm.salary = data.salary[0].enumValue
						// this.joinForm.postType = data.job[0].enumValue
						this.joinForm.education = data.education[0].enumValue
						// this.joinForm.background = data.background[0].enumValue
					}
				})
			},
			// 获取选择传过来的值
			getChild(child) {
				this.joinForm.city = child
			},
			showPCA(e) {
				this.$refs.pcaPicker.show();
			},
			getPCA(e) {
				console.log(e);
			},
			// 提交表单
			subForm(data) {
				if (data.companyName == '' || data.companyName == null) {
					uni.showToast({
						title: "请输入企业名称",
						icon: "none"
					})
				} else if (data.postType == '' || data.postType == null) {
					uni.showToast({
						title: "请输入职位名称",
						icon: "none"
					})
				} else if (data.number == '' || data.number == null) {
					uni.showToast({
						title: "请输入招聘人数",
						icon: "none"
					})
				}else if (data.number == 0) {
					uni.showToast({
						title: "招聘人数必须大于0",
						icon: "none"
					})
				}  else if (data.background == '' || data.background == null) {
					uni.showToast({
						title: "请填写工作经验",
						icon: "none"
					})
				} else if (data.type == 'jbpart' && data.certs == '') {
					uni.showToast({
						title: "兼职必须选择证书",
						icon: "none"
					})

				} else if (data.details == '' || data.details == null) {
					uni.showToast({
						title: "请输入职位描述",
						icon: "none"
					})
				} else if (data.requirement == '' || data.requirement == null) {
					uni.showToast({
						title: "请输入任职要求",
						icon: "none"
					})
				} else {
					this.$myResquest.getRecruitPut(data).then(res => {
						if (res.data.code == 200) {
							uni.showToast({
								title: "发布成功"
							})
							setTimeout(() => {
								uni.navigateBack()
							}, 1000)
						} else {
							uni.showToast({
								title: "发布失败",
								icon: "none"
							})
						}
					})
				}
			}
		}
	}
</script>

<style lang="scss" scoped>
	.activeFalse {
		    color: #49b3af;
		    font-size: 33rpx;
		    font-weight: bold;
	}

	.activeTrue {
		color: red;
	}

	.main {
		position: absolute;
		top: 0;
		z-index: 999;
		width: 100%;
		background: #ffffff;

		.joinReleamain {
			display: flex;
			flex-direction: column;
			padding: 26rpx 40rpx 0;
			box-sizing: border-box;

			image {
				width: 14rpx;
				height: 22rpx;
			}

			.joinReleamainList {
				position: relative;
			
				text {
					display: block;
					margin: 30rpx 0;
				}

				>textarea {
					height: 150rpx;
				}

				.zc_line {
					width: 670rpx;
					height: 1rpx;
					background: #e5e5e5;
					margin-top: 20rpx;
				}

				.common_line {
					text {
						display: block;
						width: 14rpx;
						color: #c0c3c8;
						margin: 0 5rpx;
					}
				}

				.selectCerts {
					width: 89%;

					text {
						width: 100%;
						text-align: right;
					}
				}

				.common_mypicker {
					display: flex;
					position: absolute;
					width: 100%;

					mypick {
						width: 100%;
						text-align: right;
					}
				}
			}
			.positClass{
				display: flex;
				font-size: 33rpx;
				font-family: Microsoft YaHei Bold, Microsoft YaHei Bold-Bold;
				font-weight: bold;
				text-align: left;
				color: #49b3af;
			}
			input{
				padding: 0 10rpx;
				box-sizing: border-box;
			}
			.joinReleamainBtn {
				width: 600rpx;
				height: 88rpx;
				line-height: 88rpx;
				text-align: center;
				background: #5cd1ce;
				border-radius: 44rpx;
				color: #ffffff;
				margin: 50rpx auto;
			}
		}
	}
</style>
